<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="/WEB-INF/tlds/messageTag.tld" prefix="msg"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title><msg:message key="menu.data" /></title>
    
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="renderer" content="webkit">
	<meta name="description" content="数据">
	<!-- <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1.0, maximum-scale=1.0"> -->
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/bootstrap.min.css" />
	<link rel="stylesheet" href="${pageContext.request.contextPath}/css/style.css">
	
	<script type="text/javascript" src="${pageContext.request.contextPath }/js/dataTime/WdatePicker.js"></script>
	<!--
	<link rel="stylesheet" type="text/css" href="styles.css">
	-->
		<!-- 底部加载js -->
	<script src="${pageContext.request.contextPath }/js/jquery-1.12.4.min.js"></script>
	<!-- 图表控件 -->
	<script src="${pageContext.request.contextPath }/js/echarts-all-3.js"></script>
	<script src="${pageContext.request.contextPath}/js/layer/layer.js"></script>
	<script src="${pageContext.request.contextPath }/js/page/common.js"></script>
	<script type="text/javascript">
	function showData() {
		
		var startTime = $("#startTime").val();
		if(startTime=="") {
			alert("请输入开始时间");
			return;
		}
		
		var endTime = $("#endTime").val();
		if(endTime==""){
			alert("请选择结束时间");
			return;
		}
		
		var lightId = $("#lightId").val();
		if(lightId=="") {
			alert("请选择对应的路灯");
			return;
		}
		
		var dataType = $("#dataType").val();
		if(dataType=="") {
			alert("请选择数据类型");
			return;
		}
		
		$("#form1").submit();
	}
	
	function selectDataType(obj,lightId) {
		$("[name='textspan']").removeClass("selected");
		$(obj).addClass("selected");
		$("#lightId").val(lightId);
	}
	</script>

  </head>
  
  <body>
    <div class="header">
		<div class="left header-logo"><img class="header-logo-img" src="images/header_logo.png" /></div>
		<div class="right header-nav">
			<a class="nav-link" href="${pageContext.request.contextPath }/main.do">
				<i class="icon icon-home"></i>
				<span class="link-text"><msg:message key="menu.homepage" /></span>
			</a>
			<c:if test="${menubean.menu1 }">
			<a class="nav-link" href="${pageContext.request.contextPath }/showDevice.do">
				<i class="icon icon-install"></i>
				<span class="link-text"><msg:message key="menu.install" /></span>
			</a>
			</c:if>
			<c:if test="${menubean.menu2 }">
			<a class="nav-link" href="${pageContext.request.contextPath}/showConfig.do">
				<i class="icon icon-config"></i>
				<span class="link-text"><msg:message key="menu.config" /></span>
			</a>
			</c:if>
			<c:if test="${menubean.menu3 }">
			<!-- <a class="nav-link" href="operation.html">
				<i class="icon icon-operation"></i>
				<span class="link-text">操作</span>
			</a> -->
			<a class="nav-link active" href="${pageContext.request.contextPath}/dataNew.do">
				<i class="icon icon-data"></i>
				<span class="link-text"><msg:message key="menu.data" /></span>
			</a>
			</c:if>
			<%-- <c:if test="${menubean.menu4 }">
			<a class="nav-link" href="history.html">
				<i class="icon icon-history"></i>
				<span class="link-text">历史</span>
			</a>
			</c:if> --%>
			<c:if test="${menubean.menu4 }">
			<a class="nav-link" href="${pageContext.request.contextPath}/faultList.do">
				<i class="icon icon-malfunction"></i>
				<span class="link-text"><msg:message key="menu.error" /></span>
			</a>
			</c:if>
			<c:if test="${menubean.menu5 }">
			<a class="nav-link" href="${pageContext.request.contextPath}/showUserList.do">
				<i class="icon icon-customer-management"></i>
				<span class="link-text"><msg:message key="menu.user" /></span>
			</a>
			</c:if>
			<c:if test="${menubean.menu6 }">
			<a class="nav-link" href="${pageContext.request.contextPath}/statusList.do">
				<i class="icon icon-status"></i>
				<span class="link-text"><msg:message key="menu.status" /></span>
			</a>
			</c:if>
			<c:if test="${menubean.menu7 }">
			<a class="nav-link" href="${pageContext.request.contextPath}/currentList.do">
				<i class="icon icon-malfunction"></i>
				<span class="link-text"><msg:message key="menu.current" /></span>
			</a>
			</c:if>
			<a class="nav-link" href="${pageContext.request.contextPath}/logout.do">
				<i class="icon icon-out"></i>
				<span class="link-text"><msg:message key="menu.exit" /></span>
			</a>
			<div class="clear"></div>
		</div>
		<div class="clear"></div>
	</div>

	<div class="section">
		<div class="page-mainbox">
			<div class="page-side1 data-side left" name="pageSide1" id="dataSide">
				<div class="page-side1-div data-side-div">
				<form id="form1" action="${pageContext.request.contextPath }/datashow.do" target="dataFrame">
					<div class="div-title"><i class="icon icon-userset"></i><msg:message key='data.condition' /></div>
					<div class="block20"></div>
					<div class="red-tip"><msg:message key='data.select.date' /></div>
					<div class="block10"></div>
					<div>
						<select id="time" name="time" class="select autowidth">
							<option value="0"><msg:message key='data.date.today' /></option>
							<option value="1"><msg:message key='data.date.oneweek' /></option>
							<option value="2"><msg:message key='data.date.onemonth' /></option>
						</select>
					</div>
					<div class="block10"></div>
					<div class="red-tip"><msg:message key='data.select.type' /></div>
					<div class="block10"></div>
					<div>
						<select id="dataType" name="dataType" class="select autowidth">
							<option value="batteryVol"><msg:message key='data.type.batteryvol' /></option>
							<option value="temperature"><msg:message key='data.type.temperature' /></option>
							<option value="solarPanelVol"><msg:message key='data.type.solarpanelvol' /></option>
							<option value="chargeCurrent"><msg:message key='data.type.chargecurrent' /></option>
							<option value="workCurrent"><msg:message key='data.type.workcurrent' /></option>
						</select>
					</div>
					<!-- <div>
						从:
						<input
							id="startTime" name="startTime" type="text"
							readonly="readonly" class="select"
							onClick="WdatePicker({dateFmt:'yyyy-MM-dd'})"
							onchange="setValidityPeriod()" />
					</div>
					<div class="block15"></div>
					<div>
						到:
						<input
							id="endTime" name="endTime" type="text"
							readonly="readonly" class="select"
							onClick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'startTime\')}'})"
							onchange="setValidityPeriod()" />
					</div> -->
					<div class="block15">
					<input type="hidden" id="lightId" name="lightId" /></div>
					<div class="red-tip"><msg:message key='data.select.device' /></div>
					<div class="block15"></div>
					<div class="level-box" name="levelBox" style="overflow-y:scroll;height:400px;">
						<ul class="level1">
							<c:forEach items="${dtuBeanList}" var="dtuBean">
							<li class="level1-li">
								<div class="level-head level1-head active" name="levelHead"><span class="head-text">${dtuBean.dtuName }</span><i class="icon icon-slide"></i></div>
								<div class="level-cont level1-cont" name="levelCont">
									<ul class="level3">
										<c:forEach items="${dtuBean.lightList }" var="lightBean">
										<li class="level3-li">
											<div class="level-head level2-head" name="levelHead"><span class="head-text" name="textspan" onclick="selectDataType(this,${lightBean.lightId })">${lightBean.lightNum } 灯杆编号</span></div>
											<%--<div class="level-cont levle2-cont" name="levelCont">
												 <ul class="level3">
													<li class="level3-li" onclick="selectDataType(${lightBean.lightId }, 'batteryVol')">
														<div class="level-head level3-head" name="levelHead"><span class="head-text">电池电压</span></div>
													</li>
													<li class="level3-li" onclick="selectDataType(${lightBean.lightId }, 'temperature')">
														<div class="level-head level3-head" name="levelHead"><span class="head-text">电池温度</span></div>
													</li>
													<li class="level3-li" onclick="selectDataType(${lightBean.lightId }, 'solarPanelVol')">
														<div class="level-head level3-head" name="levelHead"><span class="head-text">太阳板电压</span></div>
													</li>
													<li class="level3-li" onclick="selectDataType(${lightBean.lightId }, 'chargeCurrent')">
														<div class="level-head level3-head" name="levelHead"><span class="head-text">充电电流</span></div>
													</li>
													<li class="level3-li" onclick="selectDataType(${lightBean.lightId }, 'workCurrent')">
														<div class="level-head level3-head" name="levelHead"><span class="head-text">放电电流</span></div>
													</li>
												</ul> 
											</div>--%>
										</li>
										</c:forEach>
									</ul>
								</div>
							</li>
							</c:forEach>
						</ul>
					</div>
					<div class="block30"></div>
					<div class="data-side-operation">
						<a href="javascript:;" class="btn btn-primary" onclick="showData()"><msg:message key='data.btn.exec' /></a>
					</div>
					</form>
				</div>
			</div>
			<div class="page-article1 data-article right" name="pageArticle1" id="dataArticle" style="position:relative; height:800px;">
				<iframe name="dataFrame" style="border:0; width:100%; height:800px;"></iframe>
				<div class="mui-operation">
					<!-- <a href="javascript:;" class="btn orange-btn">导出</a>
					<a href="javascript:;" class="btn blue-btn">重置</a> -->
				</div>
				<div class="block30"></div>
			</div>
			<div class="clear"></div>
		</div>
	</div>

  </body>
</html>
